@import "mixin";

.content-header {
  width: 100%;
  height: rem(50px);
  line-height: rem(50px);
  padding: 0 rem(16px);
  background-color: #fff;
  z-index: 10;
  @include border-bottom-1px(#e5e5e5);
  >h5 {
    float: left;
    display: inline-block;
    vertical-align: top;
    margin-top: rem(17px);
    padding-left: rem(9px);
    border-left: rem(4px) solid #dc3838;
    height: rem(16px);
    line-height: rem(16px);
    font-weight: bold;
    font-size: rem(16px);
    color: #333333;
    >span {
      padding-left: rem(12px);
      font-size: rem(12px);
      color: #999999;
    }
  }
  >a {
    float: right;
    display: inline-block;
    vertical-align: top;
    font-size: rem(14px);
    color: #999999;
  }
  >.arrow-wrapper {
    float: right;
    display: inline-block;
    vertical-align: top;
    height: 100%;
    line-height: rem(40px);
    >.arrow-right {
      display: inline-block;
      margin: 0 0 0 rem(6px);
      vertical-align: middle;
      width: rem(8px);
      height: rem(12.5px);
      @include bg-image('../images/arrow-right');
      background-repeat: no-repeat;
      -webkit-background-size: 100% 100%;
      background-size: 100% 100%;
    }
  }
}
.content-body {
  position: fixed;
  top: rem(50px);
  bottom: 0;
  width: 100%;
  >.my-platform-wrapper {
    >.my-platform-item {
      margin-bottom: rem(10px);
      width: 100%;
      height: rem(170px);
      background-color: #fff;
      @include border-bottom-1px(#e5e5e5);
      >.item-header {
        display: flex;
        width: 100%;
        height: rem(56px);
        font-size: 0;
        >.plat-logo-wrapper {
          position: relative;
          flex: 1;
          text-align: center;
          >img {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
          }
        }
        >.plat-return-type-wrapper {
          position: relative;
          flex: 1;
          >p {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            padding-left: rem(10px);
            font-size: rem(14px);
            color: #999999;
          }
        }
        >.spread-btn-wrapper {
          position: relative;
          flex: 1;
          >.spread-btn {
            display: inline-block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            width: rem(60px);
            height: rem(30px);
            line-height: rem(28px);
            text-align: center;
            background-color: #dc3838;
            border-radius: rem(3px);
            font-size: rem(13px);
            color: #ffffff;
          }
          >.get-plat-btn {
            display: inline-block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            width: rem(60px);
            height: rem(30px);
            line-height: rem(28px);
            text-align: center;
            border: rem(1px) solid #dc3838;
            border-radius: rem(3px);
            font-size: rem(13px);
            color: #dc3838;
          }
        }
      }
      >.item-content {
        width: 100%;
        font-size: 0;
        >.item-content-wrapper {
          margin: rem(10px) 0;
          display: flex;
          >li {
            flex: 1;
            border-right: rem(1px) solid #e5e5e5;
            >p {
              text-align: center;
              font-size: rem(12px);
              color: #333333;
              >em {
                font-style: normal;
                font-size: rem(16px);
              }
              &.item-desc {
                line-height: rem(24px);
                color: #999999;
              }
            }
            &:last-child {
              border-right: none;
              >p {
                line-height: rem(16px);
                &.item-desc {
                  line-height: rem(24px);
                  color: #999999;
                }
              }
            }
          }
        }
      }
    }
  }
}